class Inventory extends PIXI.Container {
	constructor(uimanager, index, location) {
		super();

		this.uimanager = uimanager;
		this._selectedIndex = -1;

		// 添加背景
		const bg = new Background(uimanager);
		this.addChild(bg);
		
		// 添加角色栏
		this.characterView = new PIXI.Container();
		const selector = new PIXI.smooth.SmoothGraphics();
		selector.beginFill(0xE4F27C, 0.8);
		selector.lineStyle({ color: 0x58D088, width: 1, alignment: 0 });
		selector.drawEllipse(0, 0, 64, 29);
		selector.endFill();
		selector.position={x:0,y:0};
		this.characterView.addChild(selector);
		this.characterView.x = location.x;
		this.characterView.y = location.y;
		this.addChild(this.characterView);

		// 选择角色
		this.selectCharacter(index);

		uimanager.addChild(this);
	}

	selectCharacter(index) {
		if(this._selectedIndex == index)
			return;

		this._selectedIndex = index;
		for(var i = 2; i < this.children.length; i++) {
			this.removeChild(this.children[i]);
			i--;
		}

		if(this.characterView.children.length > 1)
			this.characterView.removeChild(this.characterView.children[1]);

		const character = global.party[index];	
		character.state = "run";
		character.position={x:0,y:0};
		this.characterView.addChild(character);
		if(!this.characterViewTween) this.characterViewTween = createjs.Tween.get(this.characterView.position).to({x:480,y:72},500);

		// 添加头像信息栏
		this.info = new PIXI.Container();
		this.addChild(this.info);
		if(!this.infoTween) {
			this.info.position={x:-400,y:-20}
			this.infoTween = createjs.Tween.get(this.info.position).to({x:10,y:-20},500);
		} else {
			this.info.position={x:10,y:-20};
		}

		// 添加按钮
		this.leftButton = new Button("←", {width:24,height:18});
		this.leftButton.x = 400;
		this.leftButton.y = 122;
		this.info.addChild(this.leftButton);
		
		this.rightButton = new Button("→", {width:24,height:18});
		this.rightButton.x = 520;
		this.rightButton.y = 122;
		this.info.addChild(this.rightButton);

		// 添加当前index/total
		const length = `${this._selectedIndex+1}/${global.party.length}`;
		const literal = new PIXI.Text(length, textStyle);
		literal.x = 400 + 24 + 2 + (520 - 424 - PIXI.TextMetrics.measureText(length, textStyle).width) / 2;
		literal.y = 120;
		literal.resolution = 2;
		this.info.addChild(literal);

		// 添加信息栏半身像
		if(character.avater) {
			var texture = PIXI.Texture.from(character.avater);
			const avater = new PIXI.Sprite(texture);
			this.info.addChild(avater);
		}

		// 添加名称
		const nameLiteral = character.name || "unknown";
		const nameText = new PIXI.Text(nameLiteral, textStyle);
		nameText.x = 165;
		nameText.y = 40;
		nameText.resolution = 2;
		this.info.addChild(nameText);

		// HP/MP
		const hpHeadLiteral = "HP ";
		const mpHeadLiteral = "SP ";
		const hpHeadText = new PIXI.Text(hpHeadLiteral, hpStyle);
		const mpHeadText = new PIXI.Text(mpHeadLiteral, spStyle);
		hpHeadText.x = 165;
		mpHeadText.x = 165;
		hpHeadText.y = 67;
		mpHeadText.y = 87;
		hpHeadText.resolution = 2;
		mpHeadText.resolution = 2;
		this.info.addChild(hpHeadText);
		this.info.addChild(mpHeadText);

		const hpLiteral = character.hp;
		const mpLiteral = character.sp;
		const hpText = new PIXI.Text(hpLiteral, textStyle);
		const mpText = new PIXI.Text(mpLiteral, textStyle);
		hpText.x = 200;
		mpText.x = 200;
		hpText.y = 65;
		mpText.y = 85;
		hpText.resolution = 2;
		mpText.resolution = 2;
		this.info.addChild(hpText);
		this.info.addChild(mpText);

		// lv/exp
		const lvHeadLiteral = "lv.";
		const expHeadLiteral = "exp.";
		const lvHeadText = new PIXI.Text(lvHeadLiteral, smallStyle);
		const expHeadText = new PIXI.Text(expHeadLiteral, smallStyle);
		lvHeadText.x = 10+5;
		expHeadText.x = 50+5;
		lvHeadText.y = 126;
		expHeadText.y = 126;
		lvHeadText.resolution = 2;
		expHeadText.resolution = 2;
		this.info.addChild(lvHeadText);
		this.info.addChild(expHeadText);

		const lvLiteral = character.level;
		const expLiteral = character.exp;
		const lvText = new PIXI.Text(lvLiteral, textStyle);
		const expText = new PIXI.Text(expLiteral, textStyle);
		lvText.x = 24+5;
		expText.x = 74+5;
		lvText.y = 124;
		expText.y = 124;
		lvText.resolution = 2;
		expText.resolution = 2;
		this.info.addChild(lvText);
		this.info.addChild(expText);

		// 添加分割框
		const splitMask = new PIXI.smooth.SmoothGraphics();
		splitMask.beginFill(0xE8F880, 1);
		splitMask.drawRect(0, 0, this.uimanager.realScreen.width, 1);
		splitMask.endFill();
		splitMask.y = 1;

		this.split = new PIXI.smooth.SmoothGraphics();
		this.split.beginFill(0xA8B848, 1);
		this.split.lineStyle({ color: 0x000000, width: 1, alignment: 0 });
		this.split.drawRect(-1, 0, this.uimanager.realScreen.width + 2, 6);
		this.split.endFill();
		this.split.addChild(splitMask);
		this.addChild(this.split);
		if(!this.spiltTween) {
			this.spiltTween = createjs.Tween.get(this.split.position).to({x:0,y:124},500);
		} else {
			this.split.position={x:0,y:124};
		}

		// 添加底部状态描述
		this.updateData();

		// 添加菜单
		this.menu = new Menu("MENU", 180, 170);
		this.addChild(this.menu);
		if(!this.menuTween) {
			this.menu.x = this.uimanager.realScreen.width;
			this.menu.y = 155;
			this.menuTween = createjs.Tween.get(this.menu.position).to({x:395,y:155},500);
		} else {
			this.menu.x = 395;
			this.menu.y = 155;
		}

		// 添加选单到Panel内
		this.menu.addItem(new MenuItem("变更装备"));
		this.menu.addItem(new MenuItem("变更技能"));
		this.menu.addItem(new MenuItem("提升潜能"));
		this.menu.addItem(new MenuItem("战斗策略"));
		this.menu.addItem(new MenuItem("退出社团"));
		this.menu.selectedIndex = 0;
	}

    hideData() {
        this.removeChild(this.propertyGrid);
    }

    updateData() {
        this.removeChild(this.propertyGrid);
        
        const character = global.party[this._selectedIndex];	
        this.propertyAmount = 0;
        this.propertyGrid = new PIXI.Container();
		this.addProperty("atk", "攻击力", character.atk);
		this.addProperty("def", "防御力", character.def);
		this.addProperty("mov", "移动速度", character.speed);
		this.addProperty("weg", "负重", character.weight);
		this.addProperty("range", "攻击角度范围", character.range);
		this.addProperty("keep", "攻击持续时长", character.keep);
		this.addProperty("acc", "加速度", character.acceleration);
		this.addProperty("aspd", "最低攻击间隔", character.aspd);
        this.addChild(this.propertyGrid);
    }

    hideArrowButton() {
		this.info.removeChild(this.leftButton);
		this.info.removeChild(this.rightButton);
    }

    showArrowButton() {
        this.info.addChild(this.leftButton);
		this.info.addChild(this.rightButton);
    }

	addProperty(name, descrption, value) {
		
		const columnWidth = 120;

		const headLiteral = name;
		const headText = new PIXI.Text(headLiteral, propertyStyle);
		headText.resolution = 2;
		headText.x = 20 + (this.propertyAmount % 3) * columnWidth;
		headText.y = 160 + parseInt(this.propertyAmount / 3) * 48;
		this.propertyGrid.addChild(headText);

		const literal = value;
		const text = new PIXI.Text(literal, bigStyle);
		text.resolution = 2;
		text.x = 24 + PIXI.TextMetrics.measureText(headLiteral, propertyStyle).width + (this.propertyAmount % 3) * columnWidth;
		text.y = 158 + parseInt(this.propertyAmount / 3) * 48;
		this.propertyGrid.addChild(text);

		const descrptionLiteral = descrption;
		const descrptionText = new PIXI.Text(descrptionLiteral, tipsStyle);
		descrptionText.resolution = 2;
		descrptionText.x = 24 + (this.propertyAmount % 3) * columnWidth;
		descrptionText.y = 158 + parseInt(this.propertyAmount / 3) * 48 + 28;
		this.propertyGrid.addChild(descrptionText);

		this.propertyAmount++;
	}

    resetMenu() {
        createjs.Tween.get(this.menu.position).to({x:395,y:155},200);
    }

	keyDown(key) {
        const inventory = this;
		const uimanager = this.uimanager;

		switch(key) {
			case "left": this.selectCharacter(Math.max(0, this._selectedIndex - 1)); break;
			case "right": this.selectCharacter(Math.min(global.party.length - 1, this._selectedIndex + 1)); break;
			case "up": this.menu.up(); break;
			case "down": this.menu.down(); break;
			case "z": 
                createjs.Tween.get(this.menu.position).to({x:uimanager.realScreen.width,y:155},200).call(function(e) {
                    var overlap;
                    switch(inventory.menu.selectedIndex) {
                        case 0:
                            overlap = new Equipment(global.party[inventory._selectedIndex], uimanager, inventory);
                            break;
                    }
                    uimanager.addChild(overlap);
                });
				break;
			case "x":
				this.spiltTween = createjs.Tween.get(this.split.position).to({x:this.split.position.x,y:-this.split.height},300).call(function(e) {
					uimanager.removeChild(uimanager.children[uimanager.children.length - 1]);
					uimanager.children[uimanager.children.length - 1].reset();
				});
				this.menuTween = createjs.Tween.get(this.menu.position).to({x:this.menu.position.x,y:-this.menu.height},300);
				this.infoTween = createjs.Tween.get(this.info.position).to({x:this.info.position.x,y:-this.info.height},300);
				this.infoTween = createjs.Tween.get(this.propertyGrid.position).to({x:this.propertyGrid.position.x,y:-this.propertyGrid.height},150);
				this.infoTween = createjs.Tween.get(this.characterView.position).to({x:this.characterView.position.x,y:-this.characterView.height},250);
				break;
		}
	}
}
